<template>
  <div id="app" class="wrapper wrapper-content animated fadeInRight v-cloak" v-cloak>
    <div class="row">
      <div class="col-md-12">
        <form id="sysNewsForm" method="post" class="form m-t" @submit.prevent="save()" accept-charset="UTF-8">
          <input type="hidden" name="id" v-model="item.id"/>
          <input type="hidden" name="token" v-model="item.token"/>
          <input type="hidden" name="newFlag" v-model="newFlag"/>
          <input type="hidden" name="type" value="4">
          <input type="hidden" name="isTop" value="0">
          <input type="hidden" name="state" value="1">
          <div class="clearfix "></div>
          <div class="col-md-12">
            <div class="form-group clearfix">
              <label class="col-md-8 control-label">标题：</label>
              <div class="col-md-12">
                <input id="bean-title" name="title" v-model="item.title" class="form-control" type="text" placeholder="请输入标题" required="" aria-required="true" aria-describedby="bean-title-error" maxlength="155" aria-invalid="true">
              </div>
            </div>
            <div class="form-group clearfix">
              <label class="col-md-8 control-label">封面图：
                <button type="button" id="upload_btn_cover">点击上传</button>
              </label>
              <div class="col-md-12">
                <div id="upload_div_cover" style="">
                  <div class="img-grid-2">
                    <input name="cover" v-model="item.cover" type="hidden">
                    <img :src="item.cover||require('@/assets/images/noneImage.png')" onerror="loadinitimage()" style="max-width:264px;max-height:264px">
                  </div>
                </div>
              </div>
            </div>
            <div class="form-group clearfix">
              <label class="col-md-8 control-label">答案：</label>
              <div class="col-md-12">
                <textarea  class="form-control" aria-describedby="bean-detailInfo-error" aria-invalid="true" id="bean-detailInfo" name="detailInfo" placeholder="请输入内容" style="height: 300px;width: 100%;" v-model="item.detailInfo"></textarea>
              </div>
            </div>
          </div>
          <div class="clearfix "></div>
          <div class="col-12 text-center" style="height: 50px;">
            <div>
              <input class="btn btn-primary" type="submit" value="保存"/> | <a @click="lbox.closeMyBoxLayer()" class="btn btn-danger" href="javascript:">返回</a>
            </div>
          </div>
        </form>
      </div>
    </div>
  </div>
</template>
<script type="text/javascript">
  import '@/assets/css/style.css'

  import $ from '@/assets/js/jquery-vendor.js'
  import 'jquery.cookie'
  import axios from 'axios'
  import '@/assets/js/validate/validation-vendor.js'
  import {apiUtil, axiosContentType, site} from '@/assets/js/boss'
  import '@/assets/css/upload.css'
  import '@/assets/js/upload_single_pic.js'

  export default {
    data() {
      return {
        item: {},
        newFlag: 0,
        uuidToken: ''
      }
    },
    mounted() {
      let that = window.$vueApp = this;
      document.getElementsByTagName('body')[0].className = 'fixed-sidebar full-height-layout';
      $('#sysNewsForm').validate();
      that.staff.init(function () {
        that.newFlag = sessionStorage.getItem(site.sysNews.info + '/faq');
        if (that.newFlag) that.uuidToken = apiUtil.guid();
        if (apiUtil.existSessionKey(site.sysNews.info + '/faq')) {
          that.info();
        }
      });
      window.upload_single_pic('upload_btn_cover', 'upload_div_cover', 'png,jpg,gif,bmp', 'cover');
    },
    methods: {
      info() {
        let that = this;
        axios.get(site.sysNews.info + sessionStorage.getItem(site.sysNews.info + '/faq'), {}).then(function (response) {
          const result = response.data;
          if (result.code === 0) {
            that.item = result.data;
          } else {
            alert(result.message);
          }
        });
      },
      save() {
        let that = this;
        if ($('#sysNewsForm').valid()) {
          axios.post(site.sysNews.save, $('#sysNewsForm').serialize(),
            axiosContentType.xWwwFormUrlencoded).then(function (response) {
            const result = response.data;
            // console.info("获取数据.." + JSON.stringify(result));
            if (result.code === 0) {
              parent.$vueApp.page();
              alert('保存成功!');
              that.lbox.closeMyBoxLayer()
            } else {
              alert(result.message);
            }
          });
        }
      }
    }
  }
</script>

